<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>登录用户信息</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" type="text/css" href="/layui/css/layui.css"/>
</head>


<script type="text/javascript" src="/layui/layui.js"></script>
<script type="text/javascript" src="/layui/layui.all.js"></script>
<script type="text/javascript" src="/js/jquery-2.0.3.min.js"></script>
<body>
<table id="test3" lay-filter="test3" class="layui-hide"></table>
<script>
    function findData(){
        layui.use('table', function () {
            debugger;
            var table = layui.table;
            table.render({
                elem: '#test3'
                ,url:'findAllUserInfo',
                parseData: function(res) {
                    return {
                        "code":'0', //解析接口状态
                        "msg": res.msg, //解析提示文本
                        "count":res.count, //解析数据长度
                        "data": res.data //解析数据列表
                    }
                }
                , cols: [
                    [
                        {title: '序号', type: 'numbers', Width: 20}
                        , {field: 'id', title: 'id', edit: 'text', minWidth: 80}
                        , {field: 'loginName', title: '登录名', edit: 'text', minWidth: 180, sort: true}
                        , {field: 'userName', title: '用户姓名', minWidth: 80, edit: 'text'}
                        , {field: 'idCard', title: '身份证', minWidth: 80, edit: 'text'}
                        , {field: 'photoNumber', title: '联系电话', minWidth: 80, edit: 'text'}
                        , {field: '', title: '所属角色', minWidth: 80, edit: 'text'}
                        , {field: 'department', title: '所属部门', minWidth: 80, edit: 'text'}
                        , {field: 'status', title: '状态', minWidth: 80, edit: 'text'}
                        , {field: '', title: '操作', minWidth: 80, edit: 'text'}
                    ]
                ]
                , page: true
            });
            table.on('edit(test3)', function (obj) {
                debugger;
                var value = obj.value //得到修改后的值
                    , data = obj.data //得到所在行所有键值
                    , field = obj.field; //得到字段
                layui.use('jquery', function () {
                    var $ = layui.$;
                    $.ajax({
                        type: 'get',
                        url: "updateUserInfo", // ajax请求路径
                        data: {
                            id: data.id,
                            field: field,
                            value: value
                        },
                        success: function (data) {
                            $("#test3").empty();
                            table.reload("test3", { //此处是上文提到的 初始化标识id
                                page: {
                                    curr: 1
                                }
                            });
                            layer.msg('修改成功');
                        }
                    });
                });
            })
        })
    }
    $("#search").click(function () {
        findData();
    })
    $(function(){
        findData(null,null);
    });
</script>
</body>
</html>